<template>
	<view>
		<page-menu @menuChange="getMenuIndex"></page-menu>
		<!-- <page-header :pageBack="pageInfo.back" :pageTitle="pageInfo.value"></page-header> -->
		<page-view>
			<uni-transition :duration="500" v-if="pageIndex===0" :mode-class="['slide-bottom']" :show="true">
				<techno-index></techno-index>
			</uni-transition>
			<uni-transition :duration="500" v-if="pageIndex===1" :mode-class="['slide-bottom']" :show="true">
				<tools-index></tools-index>
			</uni-transition>
			<uni-transition :duration="500" v-if="pageIndex===2" :mode-class="['slide-bottom']" :show="true">
				<life-index :bottom="bottom"></life-index>
			</uni-transition>
			<uni-transition :duration="500" v-if="pageIndex===3" :mode-class="['slide-bottom']" :show="true">
				<my-index></my-index>
			</uni-transition>
		</page-view>
	</view>
</template>

<script>
	import pageMenu from '@/components/page-menu/index.vue' //引入菜单
	import pageHeader from '@/components/page-header/index.vue' //引入头部
	import pageView from '@/components/page-view/index.vue' //引入内容路由部分
	import uniTransition from '@/components/uni-transition/uni-transition.vue' //过渡插件
	///分隔符
	import technoIndex from '@/components/page-view/techno-index/index.vue' //引入技术页面
	import toolsIndex from '@/components/page-view/tools-index/index.vue' //引入技术页面
	import lifeIndex from '@/components/page-view/life-index/index.vue' //引入生活页面
	import myIndex from '@/components/page-view/my-index/index.vue' //引入我的页面
	export default {
		components: {
			pageMenu,
			pageHeader,
			pageView,
			uniTransition,
			technoIndex,
			toolsIndex,
			lifeIndex,
			myIndex
		},
		data() {
			return {
				pageInfo: {
					key: 'first',
					value: '技术',
					back: false
				},
				pageIndex: 0,
				bottom: 1
			}
		},
		onReachBottom() {
			console.log('我到底了、。。。。。。。。。。')
			this.bottom++;
			// this.fillData();
		},
		methods: {
			getData() {
				//this.$request.get('admin/index', {}).then(res => {})
			},
			getMenuIndex(index, item) {
				this.pageIndex = index;
				this.pageInfo = item;
				uni.setNavigationBarTitle({
					title: item.value
				});
			}
		}
	}
</script>

<style lang="less" scoped="scoped">

</style>
